<template>
	<view>
		<u-popup :show="data.show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false"
			@close="data.show = false">
			<view class="passMain">
				<view class="title">签署密码</view>
				<input class="uni-input" v-model="data.password" type="password" placeholder="请输入签署密码" />
				<u-button type="primary" @click="passOk" :disabled="!data.password">确认</u-button>
				<view class="rest" @click="showSignPassword">设置|重置签署密码</view>
			</view>
		</u-popup>
		<u-popup :show="loginForm.show" mode="center" :round="10" :closeable="true" :safeAreaInsetBottom="false"
			:customStyle='style' @close="loginForm.show = false">
			<view class="passMain" style="padding:0">
				<view class="title" style="margin-bottom: 20rpx;">设置|重置签署密码</view>
				<u--form ref="loginFormRef" :model="loginForm.data" :rules="loginForm.rule">
					<u-form-item label="签署密码" prop="sign_password" borderBottom labelWidth="70"
						customStyle="marginTop:10rpx">
						<u-input v-model="loginForm.data.sign_password" placeholder="输入签署密码" customStyle="height:56rpx"
							border="none" type="password"></u-input>
					</u-form-item>
					<u-form-item label="确认密码" labelWidth="70" borderBottom prop="sign_confirm_password"
						customStyle="marginTop:10rpx">
						<u-input v-model="loginForm.data.sign_confirm_password" placeholder="确认签署密码" border="none"
							type="password" customStyle="height:56rpx;"></u-input>
					</u-form-item>
					<u-form-item label="手机号" labelWidth="70" prop="cellphone" borderBottom
						customStyle="marginTop:10rpx">
						<u-input v-model="loginForm.data.cellphone" readonly customStyle="height:56rpx" border="none"
							maxlength='11' type='number' placeholder="输入手机号"></u-input>
					</u-form-item>
					<u-form-item label="验证码" labelWidth="70" prop="code" borderBottom customStyle="marginTop:10rpx">
						<u-input v-model="loginForm.data.code" border="none" placeholder="验证码"
							customStyle="height:56rpx" maxlength='6' type='number'></u-input>
						<template v-slot:right>
							<view @click="sendSms">
								<sms ref="smsC"></sms>
							</view>
						</template>
					</u-form-item>
				</u--form>
				<view class="pass-tip">注：密码需字母与数字组合，最少6位</view>
				<view style="height: 50rpx;"></view>
				<u-button type="primary" @click="loginForm.submit">确认</u-button>
			</view>
		</u-popup>
	</view>
</template>
<script setup>
	import {
		ref,
		reactive,
		defineEmits
	} from 'vue';
	import {
		sms
	} from '@/components/sms.vue'
	import {
		goNav,
		msg
	} from "@/utils/common";
	import {
		setPassWordSign
	} from "@/api/module/common";
	import {
		onShow,
		onLoad
	} from "@dcloudio/uni-app";
	import {
		commonMemberInfo,
		memberInfo
	} from "../api/module/mine";
	onLoad(() => {
		commonMemberInfo().then(response => {
			loginForm.data.cellphone = response.member.cellphone;
			console.log('获取用户信息',loginForm.data);
		})
	})
	onShow(() => {

	})
	const showSignPassword = () => {
		loginForm.show = true;
		loginForm.data.sign_password = '';
		loginForm.data.sign_confirm_password = '';
		loginForm.data.code = '';
		console.log(loginForm.data);
	}
	const smsC = ref();
	const shabishow = ref(true);
	const style = ref({
		width: '85%',
		padding: '50rpx 50rpx'
	})
	const data = ref({
		show: false,
		password: '',
		params: {}
	})
	const emit = defineEmits(['return-pass']);
	const loginFormRef = ref(null)
	const loginForm = reactive({
		show: false,
		data: ref({
			cellphone: '',
			sign_password: '',
			sign_confirm_password: '',
			code: '',
		}),
		formRule: function() {
			return ref({
				cellphone: [{
					required: true,
					message: '请输入手机号',
					trigger: 'blur'
				}],
				sign_password: [{
					required: true,
					message: '请输入签署密码',
					trigger: 'blur'
				}],
				sign_confirm_password: [{
					required: true,
					message: '请确认签署密码',
					trigger: 'blur'
				}],
				code: [{
					required: true,
					message: '请输入验证码',
					trigger: 'blur'
				}],
			})
		},
		submit: function() {
			loginFormRef.value.setRules(loginForm.formRule());
			loginFormRef.value.validate().then(validate => {
				if (validate) {
					setPassWordSign(loginForm.data).then(res => {
						msg('重置成功');
						data.value.password = '';
						loginForm.show = false
					})
				}
			});
		}
	})
	const sendSms = () => {
		smsC.value.send({
			phone: loginForm.data.cellphone,
			type: "sign_password",
		})
	}
	const passOk = () => {
		var data_ = data.value.params;
		data_.password = data.value.password
		emit('return-pass', data_);
	}
	const open = (json) => {
		data.value.password = ''
		data.value.show = true;
		data.value.params = json
	}
	const close = (json) => {
		data.value.show = false;
	}
	defineExpose({
		open,
		close
	});
</script>
<style lang="scss" scoped>
	.passMain {
		padding: 50rpx 100rpx;

		.title {
			font-size: 36rpx;
			font-weight: bold;
			margin-top: 20rpx;
			text-align: center;
		}

		.uni-input {
			border: 1rpx solid #c8c9cc;
			margin: 36rpx 0;
			padding: 16rpx;
			border-radius: 12rpx;
		}

		.rest {
			text-align: right;
			color: #2979ff;
			font-size: 30rpx;
			margin-top: 50rpx;
		}

		:deep(.u-popup__content) {
			width: 80%;
		}
	}
</style>
